<template>
  <div class="pushStore">
    <p>{{ name }}</p>
    <div
      v-for="(pushStore, index) in pushStores"
      :key="pushStore.goodsId"
      class="push"
    >
      <label :for="'name' + index" @click="ons(pushStore.goodsId)">
        <img :src="pushStore.pics[0]" />
      </label>
      <router-link :to="'/app1/' +pushStore.goodsId" :id="'name' + index" @click="ons(pushStore.goodsId)">{{
        pushStore.goodsName
      }}</router-link>
      <div class="store">
        <span>￥{{ pushStore.goodsPrice }}</span>
        <span>已售10件</span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: ['pushStores', 'name'],
  methods: {
    ons(id) {
     let path='/app1/'+id
     this.$router.push(path)
     location.reload();
    },
     //下载图片
  handlePreview(data){
    this.$api.rear_end.download(data).then(res=>{
        let url=window.URL.createObjectURL(new Blob([res.data], { type: 'image/jpeg' }))
        this.previewPath=url  
    })

    },
  },
}
</script>

<style scoped>
.pushStore p {
  width: 100%;
  height: 50px;
  line-height: 50px;
  margin-left: 30px;
}
.push {
  width: 200px;
  height: 250px;
  margin-top: 10px;
  margin-left: 20px;
  float: left;
}
.push img {
  width: 150px;
  height: 150px;
  border-radius: 20px;
}
.push a {
  width: 150px;
  height: 50px;
  text-align: center;
  display: block;
  text-decoration: none;
  color: #7f7f7f;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.push .store {
  width: 150px;
  height: 30px;
  line-height: 30px;
}
.push .store span:nth-of-type(1) {
  color: #ff621b;
  font-size: 18px;
}
.push .store span:last-child {
  float: right;
  font-size: 15px;
}
</style>
